<template>
    <div id="app">
        <Layout class="system-layout" v-if="$route.meta.showLayout">
            <div class="system-content">
                <system-header />
                <div class="app-content">
                    <system-sidebar />
                    <router-view />
                </div>
            </div>
            <system-footer />
        </Layout>
        <router-view v-else />
    </div>
</template>

<script>
import SystemHeader from '@/components/SystemHeader'
import SystemSidebar from '@/components/SystemSidebar'
import SystemFooter from '@/components/SystemFooter'

export default {
    name: 'app',
    components: {
        SystemHeader,
        SystemSidebar,
        SystemFooter
    }
}
</script>

<style lang="less">
#app {
  height: 100%;
  .app-content {
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding-top: 60px;
    display: flex;
  }
}
.ivu-layout.ivu-layout-has-sider{
    display: inherit;
}
.ivu-table-tbody td:last-child .ivu-table-cell{
    width: 150px;
    padding-left: 0;
}
</style>
